<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- 页面meta -->
    <meta charset="utf-8">
    <title>日语单词测试</title>

    <!-- Tell the browser to be responsive to screen width -->
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
	<link rel="shortcut icon" href="logo.png">
    <link rel="stylesheet" href="css/adminlte.css">
    <link rel="stylesheet" href="css/toggle.css">
    <style>
        .dark-mode .card-link {
            color: #9cd4f7;
        }

        .card-link-right {
            float: right;
            text-decoration: none;
        }

        .dark-mode .card-link-right {
            color: #9cd4f7;
        }

        .custom-radio-scale {
            transform-origin: left top;
            transform: scale(1.1, 1.1);
            height: 1.75rem;
        }

        .input-multi-characters {
            display: inline;
            width: 1rem;
            padding: unset;
            border-bottom-width: 2px;
            font-size: 1rem;
            margin-left: 5px;
            margin-right: 5px;
        }

        .input-multi-characters[readonly] {
            background-color: #ffffff;
        }

        .input-multi-characters:focus {
            border-color: #333399;
        }

        .dark-mode .input-multi-characters:focus {
            border-color: #7f3bd8;
        }

        .col-kana {
            -webkit-flex: 0 0 10%;
            -ms-flex: 0 0 10%;
            flex: 0 0 10%;
        }

        .col-del {
            -webkit-flex: 0 0 20%;
            -ms-flex: 0 0 20%;
            flex: 0 0 20%;
            max-width: 20%;
        }

        .canvas-row {
            width: 100%;
            height: 154px;
            margin-bottom: 0.5rem;
        }

        .canvas-col-left {
            width: 2rem;
            height: 100%;
            float: left;
            position: relative
        }

        .canvas-col-left-bottom {
            position: absolute;
            bottom: 0
        }

        .canvas-col-middle {
            border-color: #0c5460;
            border-width: 2px;
            border-style: solid;
            /*display: inline-block;*/
            width: 154px;
            height: 154px;
            float: left
        }

        .dark-mode .canvas-col-middle {
            border-color: #42c9df;
        }

        .canvas {
            width: 100%;
            height: 100%;
        }

        .canvas-col-right {
            height: 100%;
            float: left;
            position: relative;
            padding-left: 0.5rem;
        }

        .canvas-answer {
            font-size: 3rem;
        }

        .dark-mode .canvas-answer {
            color: #377f3d;
        }

        .btn-canvas-clear {
            padding: 0.125rem 0.125rem;
            font-size: 0.7rem;
            line-height: 1.5;
            border-radius: 0.15rem;
        }

        .canvas-row-check {
            width: 100%;
            margin-top: 1rem;
            margin-bottom: 1rem;
            text-align: left;
        }

        .card-text-wrong-word-list {
            margin-bottom: 0.25rem;
            color:#c43939;
        }

        .btn-kana {
            padding: 4px 6px;
            margin-right: 10px;
            font-size: 1.25rem;
            line-height: 1.5;
            border-radius: 0.15rem;
        }



    </style>
    <script src="js/jquery-3.6.0.min.js"></script>
    <script src="js/utils.js"></script>
    <script src="js/sel-word-page.js"></script>
    <script src="js/title-page.js"></script>
    <script src="js/setting-page.js"></script>
    <script src="js/common.js"></script>


</head>

<body class="hold-transition layout-top-nav" style="background-color: #ecf0f5">
<div class="wrapper">
    <div class="content-wrapper">
        <div class="content-header">
            <div class="container">
                <h1 class="m-0">
                    <small>日语单词测试</small>
                </h1>
            </div>
        </div>

        <div class="content">
            <div class="container">
                <div class="card card-primary card-outline">
                    <div class="card-body">
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
</html>